<template>
	<mg-popup v-model="show" :z-index="5000">
		<view class="gdmdxx o-y-s bf7 p13">
			<view class="p3 p-r f40 c0 wei t-c">{{co.shopData.name}}
				<text @click="show=false" class="iconfont iconx f38 cd p-a r0 mr10"></text>
			</view>
			<scroll-view scroll-y class="svbd f24 c9">
				<!-- <view class="p20 wei c0 f28">优惠券</view>
				<view class="mb20">
					<view v-for="(v,i) in 2" :key='i' class="cou p-r bf bs20 f26 f-row wei mb20">
						<view class="f-c-c coul">
							<view class="f-y-c cf5f">
								<text class="">{{sl}}</text>
								<text class="ml5 f56">6</text>
							</view>
						</view>
						<view class="f-1 f-c-xc">
							<view class="f32 c3">店铺红包</view>
							<view class="c6 mt10 nowei">无门槛，2020.09.02到期</view>
						</view>
						<view class="f-c-c cour">
							<view v-if="i==0" class="cf bf5f lq f-c">领取</view>
							<image v-else class="p-a ylq" src="../../../static/yhq/lyq.png"></image>
						</view>
					</view>
				</view>
				<view class="p20 wei c0 f28">优惠活动</view>
				<view class="f-s mb20">
					<view class="lbtn lbtn2">满减</view>
					<view class="f-1 ml20">(全部人群)
						<text class="ml20">{{mj.qbmj}}</text>
					</view>
				</view>
				<view class="f-s mb20">
					<view class="lbtn lbtn2">满减</view>
					<view class="f-1 ml20">(新客专享)
						<text class="ml20">{{mj.xkmj}}</text>
					</view>
				</view>
				<view class="f-s mb20">
					<view class="lbtn lbtn2">满减</view>
					<view class="f-1 ml20">(VIP专享)
						<text class="ml20">{{mj.hymj}}</text>
					</view>
				</view>
				<view class="f-s mb20">
					<view class="lbtn lbtn3">新客</view>
					<view class="f-1 ml20">本店新用户立减{{sl+co.storeInfo.newMoney}}</view>
				</view> -->
				<!-- <view class="p20 wei c0 f28">商家服务</view>
				<view class="f-s mb20">
					<view class="lbtn">食无忧</view>
					<view class="f-1 ml20">该商户已购买食品安全责任险，食品安全有保障</view>
				</view>
				<view class="f-s">
					<view class="lbtn">开发票</view>
					<view class="f-1 ml20">该商户支持开发持开发持开发票，请在下单时填写好发票抬头</view>
				</view> -->
				<view class="p20 c0 f28">公告</view>
				<view>{{co.moreSet.notic}}</view>
				<view class="p20 c0 f28">配送信息</view>
				<view>满{{co.shopData.distribution.startMoney}}起送{{co.moreSet.distributionSupport.find(v=>v==2)?'，支持到店自取':''}}；</view>
				<view>由{{co.shopData.deliveryMode}}提供配送服务，距门店{{co.shopData.delivery}}km范围内配送，配送费用受天气、时间等多方因素影响，已实际配送费为准。</view>
				<view class="p20 c0 f28">门店信息</view>
				<view>营业时间：{{yysj}}</view>
				<view>联系电话：{{co.shopData.storeTel}}</view>
				<view class="f-row">
					<view>门店地址：</view>
					<view class="f-1 mr20">{{co.shopData.address}}</view>
					<view class="f-y-c">
						<view @click="ckwz" class="f-c dzic bsf mr60 p-r o-v">
							<text class="iconfont icondtdh dzi"></text>
							<text class="p-a dd cf5f f18 bs10">到店</text>
						</view>
						<view @click="util.makeTel(co.shopData.storeTel)" class="f-c dzic bsf">
							<text class="iconfont icondh dzi"></text>
						</view>
					</view>
				</view>
				<!-- <view @click="ckda" class="p20 f-y-c wei c0 f28">查看食品安全档案<text class='iconfont iconright f24 ml10 c0'></text></view> -->
			</scroll-view>
		</view>
	</mg-popup>
</template>

<script>
	import {
		mapState,
		mapActions
	} from 'vuex'
	import mgPopup from '@/components/common/popup.vue'
	import utils from '@/common/utils.js'
	export default {
		name: 'mg-share',
		components: {
			mgPopup,
		},
		props: {
			co: {
				type: Object,
				default: function() {
					return {}
				}
			},
			value: {
				type: Boolean,
				default: false
			},
			ptype: String,
		},
		data() {
			return {}
		},
		computed: {
			show: {
				get() {
					return this.value;
				},
				set(newVal) {
					this.$emit("input", newVal)
				}
			},
			mj() {
				return {
					qbmj: '满30元减28元，满52元减44元，满78元减50元，满100元减60元，满150元减80元' || this.co.storeSet.data,
					xkmj: '满30元减28元，满52元减44元' || this.co.newStoreSet.data,
					hymj: '满100元减60元，满150元减80元' || this.co.vipStoreSet.data
				}
			},
			yysj() {
				let text = ''
				let info = this.co.moreSet
				if (info.timeType == 1) {
					text = '24小时营业'
				} else {
					text = `${info.timeArr[0].startTime}-${info.timeArr[0].ciri?'次日':''}${info.timeArr[0].endTime}`
					if (info.timeArr[1]) {
						text += ' ' +
							`${info.timeArr[1].startTime}-${info.timeArr[1].ciri?'次日':''}${info.timeArr[1].endTime}`
					}
					if (info.timeArr[2]) {
						text += ' ' +
							`${info.timeArr[2].startTime}-${info.timeArr[2].ciri?'次日':''}${info.timeArr[2].endTime}`
					}
				}
				return text
			},
		},
		watch: {},
		methods: {
			ckwz() {
				this.util.ckWz({
					lat: this.co.shopData.lat,
					lng: this.co.shopData.lng,
					name: this.co.shopData.name,
					address: this.co.shopData.address,
				})
			},
			ckda() {
				this.go({
					t: 1,
					url: 'sjjs?type=2&info=' + encodeURIComponent(JSON.stringify(this.co.storeInfo))
				})
			},
		},
	}
</script>

<style scoped lang="scss">
	.gdmdxx {
		border-radius: 35rpx 35rpx 0 0;

		.svbd {
			max-height: 900rpx;
		}

		.lbtn {
			font-size: 20rpx;
			color: #666;
			padding: 3rpx 25rpx;
			border: 1px solid #ddd;
			border-radius: 5rpx;
		}

		.lbtn2 {
			color: #FF5F2F;
			border-color: #F3D8DB;
		}

		.lbtn3 {
			color: #4BC436;
			border-color: #98ED8B;
		}
	}

	.cou {

		.coul,
		.cour {
			width: 174rpx;
		}

		height: 174rpx;

		.lq {
			min-width: 126rpx;
			height: 64rpx;
			border-radius: 64rpx;
		}

		.ylq {
			width: 125rpx;
			height: 125rpx;
			bottom: -20rpx;
			right: 0;
		}
	}

	.dzic {
		width: 58rpx;
		height: 58rpx;
		background: #F2F3F5;

		.dzi {
			color: #5B688B;
		}

		.dd {
			background: #FFEFEA;
			padding: 3rpx 10rpx;
			top: -10%;
			right: -70%;
		}
	}
</style>
